<script>
var headers = ["h1", "h2", "h3", "h4"]
var colors = ["red", "orange", "green", "blue"]

$.each(headers, function(i, header){
    var color = colors[i];
    $(header).each(function () {
        var href=$(this).attr("id");
        $(this).append('<a class="headerlink" style="color:' + color + '" href="#' + href + '" title="Permanent link">¶</a>')
    });
})

// Ensure that sidebar on left has arrows
$(".pancakes-parent").on('click', function(){
    console.log($(this).next());
    $(this).next().find('.pancakes-child').toggle();
    if ($(this).hasClass('open-parent')){
        $(this).removeClass('open-parent');
    } else {
        $(this).addClass('open-parent');
    }
})

$(".pancakes-parent-mobile").on('click', function(){
    var nav = $(this).next();
     nav.addClass('mobile-sub-navbar-display');
})

$(".mobile-navbar-back").on('click', function(){
    var nav = $(this).parent();
    nav.removeClass('mobile-sub-navbar-display');
})

</script>
<script type="text/javascript" async
  src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.1/MathJax.js?config=TeX-MML-AM_CHTML">
</script>
